<script setup lang="ts">
import {createFromIconfontCN, UserOutlined} from "@ant-design/icons-vue";
import {ECode, iconFontAddress} from "@/util/commonUtil";
import {onBeforeMount, ref, watch} from "vue";
import {getBlogListByUser, getQuestionListByUser, getUserWatchList} from "@/api/user/user";
import {useRoute} from "vue-router";
import {message} from "ant-design-vue";
import {getUserMomentList} from "@/api/moment/moment";
import {getProblemQueryList} from "@/api/problem/problem";
import PostDataList from "../dataList/index.vue"
import FansList from "../fansList/index.vue"

const IconFont = createFromIconfontCN({
  scriptUrl: iconFontAddress,
});
const route = useRoute()
// 问答数组
const listData = ref<any>([])
// 问答数组长度
const postList = ref<any>([])
const userWatchListData = ref<any>([])
const userFansList = ref<any>([])
const momentList = ref<any>([])
const newProblemData = ref<any>([])
const activeKey = ref('1');
const props = defineProps({
  adminUid: {
    type: String,
    default: () => ''
  },
  userUid: {
    type: String,
    default: () => ''
  },
  userCenterInfo:{
    type: Object,
    default: () => {}
  }
})
const currentPage = ref<number>(1)
const pageSize = ref<number>(8)
const orderByDescColumn = ref<string>('create_time')
const total = ref<number>(0)
const isEnd = ref<boolean>(false)

onBeforeMount(() => {
  getPostList()
})

watch(() => route, () => {
  listData.value = []
  userWatchListData.value = []
})

function tabChange(type: any) {
  postList.value = []
  listData.value = []
  userWatchListData.value = []
  userFansList.value = []
  currentPage.value = 1
  switch (type) {
    case '1': {
      getPostList()
    }
      break;
    case '2': {
      getQuestionList()
    }
      break;
    case '3': {
      getWatchList()
    }
      break;
    case '4': {
      getWatchFansList()
    }
      break
    case '5': {
      getDynamicList()
    }
      break;
    case '6': {
      getQuestionListByUserTab()
    }
      break;
  }
}

function getPostList() {
  let params: any = {};
  params.currentPage = currentPage.value;
  params.pageSize = pageSize.value;
  params.orderByDescColumn = orderByDescColumn.value
  params.adminUid = props.adminUid
  params.userUid = props.userUid
  getBlogListByUser(params).then((response: any) => {
    if (response.code == ECode.SUCCESS) {
      let newData = response.data.records;
      postList.value = postList.value.concat(newData);
      total.value = response.data.total;
      pageSize.value = response.data.size;
      currentPage.value = response.data.current;
      //全部加载完毕
      if (newData.length < pageSize.value) {
        isEnd.value = true;
      }
    }
  })
}

function getQuestionList() {
  let params: any = {};
  params.currentPage = currentPage.value;
  params.pageSize = pageSize.value;
  params.orderByDescColumn = orderByDescColumn.value
  params.adminUid = props.adminUid
  params.userUid = props.userUid
  getQuestionListByUser(params).then((response: any) => {
    if (response.code == ECode.SUCCESS) {
      let newData = response.data.records;
      listData.value = listData.value.concat(newData);
      total.value = response.data.total;
      pageSize.value = response.data.size;
      currentPage.value = response.data.current;
      //全部加载完毕
      if (newData.length < pageSize.value) {
        isEnd.value = true;
      }
    }
  })
}

function getWatchList() {
  let params: any = {};
  params.userUid = props.adminUid ? props.adminUid : props.userUid
  params.currentPage = currentPage.value;
  params.pageSize = pageSize.value;
  getUserWatchList(params).then((response: any) => {
    if (response.code == ECode.SUCCESS) {
      let newData = response.data.records
      userWatchListData.value = userWatchListData.value.concat(newData)
      total.value = response.data.total;
      pageSize.value = response.data.size;
      currentPage.value = response.data.current;
      //全部加载完毕
      if (newData.length < pageSize.value) {
        isEnd.value = true;
      }
    } else {
      message.error(response.message)
    }
  })
}

function getWatchFansList() {
  let params: any = {};
  params.toUserUid = props.adminUid ? props.adminUid : props.userUid
  params.currentPage = currentPage.value;
  params.pageSize = pageSize.value;
  getUserWatchList(params).then((response: any) => {
    if (response.code == ECode.SUCCESS) {
      let newData = response.data.records
      userFansList.value = userFansList.value.concat(newData)
      total.value = response.data.total;
      pageSize.value = response.data.size;
      currentPage.value = response.data.current;
      //全部加载完毕
      if (newData.length < pageSize.value) {
        isEnd.value = true;
      }
    } else {
      message.error(response.message)
    }
  })
}

function getDynamicList() {
  let params: any = {};
  params.currentPage = currentPage.value;
  params.pageSize = pageSize.value;
  params.orderByDescColumn = orderByDescColumn.value
  params.adminUid = props.adminUid
  params.userUid = props.userUid
  getUserMomentList(params).then((response: any) => {
    if (response.code == ECode.SUCCESS) {
      let newData = response.data.records
      momentList.value = momentList.value.concat(newData)
      //全部加载完毕
      if (newData.length < pageSize.value) {
        isEnd.value = true;
      }
    } else {
      message.error(response.message)
    }
  })
}

function getQuestionListByUserTab() {
  let params: any = {};
  params.currentPage = currentPage.value;
  params.pageSize = pageSize.value;
  params.orderByDescColumn = orderByDescColumn.value
  params.userUid = props.userUid
  getProblemQueryList(params).then((response: any) => {
    if (response.code == ECode.SUCCESS) {
      isEnd.value = false;
      let records = response.data.records
      newProblemData.value = newProblemData.value.concat(records);
      total.value = response.data.total;
      pageSize.value = response.data.size;
      currentPage.value = response.data.current;
      //全部加载完毕
      if (records.length < pageSize.value) {
        isEnd.value = true;
      }
    } else {
      isEnd.value = true;
    }
  })
}

function loadMoreCurrentPage(e: number, type: string) {
  currentPage.value = e
  switch (type) {
    case 'post':
      getPostList()
      break;
    case 'wenda':
      getQuestionList()
      break;
  }
}
</script>

<template>
  <div class="authorWidget rounded-xl">
    <div class="affixHeader">
      <a-tabs v-model:activeKey="activeKey" centered @change="tabChange">
        <a-tab-pane key="1">
          <template #tab>
            <IconFont type="icon-wenzhang"/>
            <span>文章</span>
            <sup class="text-[12px]">{{ userCenterInfo.blogCount }}</sup>
          </template>
          <PostDataList :data-list="postList" :isEnd="isEnd" :currentPage="currentPage"
                        @loadMoreCurrentPage="loadMoreCurrentPage($event,'post')"/>
        </a-tab-pane>
        <a-tab-pane key="2">
          <template #tab>
            <IconFont type="icon-wenda"/>
            <span>问答</span>
            <sup class="text-[12px]">{{ userCenterInfo.questionCount }}</sup>
          </template>
          <PostDataList :data-list="listData" :isEnd="isEnd" :currentPage="currentPage"
                        @loadMoreCurrentPage="loadMoreCurrentPage($event,'wenda')"/>
        </a-tab-pane>
        <a-tab-pane key="3">
          <template #tab>
            <IconFont type="icon-aixin" class="text-base"/>
            <span>TA的关注</span>
            <sup class="text-[12px]">{{ userCenterInfo.watchCount }}</sup>
          </template>
          <FansList :fans-list="userWatchListData" :isEnd="isEnd" :currentPage="currentPage"
                    @loadMoreCurrentPage="loadMoreCurrentPage($event,'fans')"/>
        </a-tab-pane>
        <a-tab-pane key="4">
          <template #tab>
            <UserOutlined/>
            <span>TA的粉丝</span>
            <sup class="text-[12px]">{{ userCenterInfo.followCount }}</sup>
          </template>
          <FansList :fans-list="userFansList" :isEnd="isEnd" :currentPage="currentPage"
                    @loadMoreCurrentPage="loadMoreCurrentPage($event,'fans')"/>
        </a-tab-pane>
        <a-tab-pane key="5">
          <template #tab>
            <IconFont type="icon-huati" class="text-base"/>
            <span>动态</span>
            <sup class="text-[12px]">{{ userCenterInfo.momentCount }}</sup>
          </template>
          动态列表，还没写
        </a-tab-pane>
        <a-tab-pane key="6">
          <template #tab>
            <IconFont type="icon-wenti"/>
            <span>问题</span>
            <sup class="text-[12px]">{{ userCenterInfo.problemCount }}</sup>
          </template>
          问题列表，还没写
        </a-tab-pane>
      </a-tabs>
    </div>
  </div>
</template>

<style scoped lang="less">
.authorWidget {
  clear: both;
  padding: 15px;
  box-shadow: 0 0 10px rgba(116, 116, 116, 0.08);
  margin-bottom: 20px;
}

.authorWidget {
  border: thin solid rgb(203 213 225);
}
</style>
